<template>
  <div id="orglist">
    <div class="tools">
      <el-button type="primary" @click="addOrg">新建机构</el-button>
    </div>
    <el-table v-loading="loading" row-key="id" :data="orgList" style="width: 100%">
      <el-table-column label="序号" width="60" align="center">
        <template #default="scope">
          <span>{{scope.$index+1}}</span>
        </template>
      </el-table-column>
      <el-table-column label="机构名称" align="center">
        <template #default="scope">
          <el-link type="primary" :underline="false" @click="editOrg(scope.row.id)">{{scope.row.name}}</el-link>
        </template>
      </el-table-column>
      <el-table-column prop="code" label="机构编码" width="120" align="center"></el-table-column>
      <el-table-column label="机构类型" align="center" width="100">
        <template #default="scope">
          {{getType(scope.row.type)}}
        </template>
      </el-table-column>
      <el-table-column label="机构状态" align="center" width="100">
        <template #default="scope">
          {{
            getStatus(scope.row.status)
            }}
        </template>
      </el-table-column>
      <el-table-column prop="contactName" label="联系人" width="120" align="center"></el-table-column>
      <el-table-column prop="contactTel" label="联系电话" width="150" align="center"></el-table-column>
      <el-table-column prop="createTime" label="创建时间" width="180" align="center"></el-table-column>
      <el-table-column fixed="right" label="操作" width="90" align="center">
        <template #default="scope">
          <el-button size="small" icon="EditPen" type="primary" plain circle @click="editOrg(scope.row.id)"></el-button>
          <el-button size="small" type="danger" icon="Delete" plain circle @click="deleteOrg(scope.row.id)"></el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script setup lang="ts">
import { ref, reactive, getCurrentInstance } from 'vue';
import { notifyType, notifyMessage } from '../../utils/common';
let { proxy }: any = getCurrentInstance();
let loading = ref(false);
let orgList: any = reactive([]);

findOrgList();
 
function findOrgList() {
  loading.value = true;
  orgList.length = 0;
  const url = '/api/sys/findOrgAllList';
  proxy.$http
    .get(url)
    .then((res: any) => {
      if (res.status.code !== 1) {
        notifyMessage(res.status.msg, notifyType.warning, proxy);
      } else {
        orgList.push(...res.data.orgList);
      }
      loading.value = false;
    })
    .catch((err: string) => {
      loading.value = false;
      notifyMessage(err, notifyType.warning, proxy);
    });
}

function getType(type: any) {
  switch (type) {
    case 0:
      return '普通机构';
    case 1:
      return '检验中心';
    default:
      return '';
  }
}

function getStatus(type: any) {
  switch (type) {
    case 0:
      return '启用';
    case 1:
      return '禁用';
    default:
      return '';
  }
}

function addOrg() {
  proxy.$router.push({ path: '/orgsave' });
}

//编辑
function editOrg(id: string) {
  proxy.$router.push({ path: '/orgsave', query: { id } });
}

//删除
function deleteOrg(id: string) {
  proxy
    .$confirm('确定删除此机构?', '提示', {
      cancelButtonClass: 'cancel-button',
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning'
    })
    .then(() => {
      const url = '/api/sys/deleteOrg';
      proxy.$http
        .post(url, { id })
        .then((res: any) => {
          if (res.status.code === 1) {
            notifyMessage('删除成功', notifyType.success, proxy);
            findOrgList();
          } else {
            notifyMessage(res.status.msg, notifyType.warning, proxy);
          }
        })
        .catch((err: string) => {
          notifyMessage(err, notifyType.warning, proxy);
        });
    })
    .catch((err: string) => {
      console.log(err);
    });
}
</script>
